<!DOCTYPE html>
<html lang="en">
<head>
<title>Contact</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
		function hideURLbar(){ window.scrollTo(0,1); } </script>
		<link rel="shortcut icon" href="images/favicon/favicon.png">
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link rel="stylesheet" href="css/faqstyle.css" type="text/css" media="all" />
<link href="css/medile.css" rel='stylesheet' type='text/css' />
<link href="css/single.css" rel='stylesheet' type='text/css' />
<link rel="stylesheet" href="css/contactstyle.css" type="text/css" media="all" />
<link rel="stylesheet" href="css/font-awesome.min.css" />
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<script type="text/javascript">
	jQuery(document).ready(function($) {
		$(".scroll").click(function(event){
			event.preventDefault();
			$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
		});
	});
</script>
</head>
<body>
	<div class="header">
		<div class="container">
			<div class="w3layouts_logo">
				<a href="index.html"><h1>Tea<span>天马茗茶</span></h1></a>
			</div>
			<div class="w3_search">
				<form action="#" method="post">
					<input type="text" name="Search" placeholder="请输入茶叶名" required="">
					<input type="submit" value="搜索">
				</form>
			</div>
			<div class="w3l_sign_in_register">
				<ul>
					<li><i class="fa fa-phone" aria-hidden="true"></i> (+86) 155 2561 7020</li>
					<li><a href="#" data-toggle="modal" data-target="#myModal">登录</a></li>
					<li style="line-height:30px;color:#FF8D1B;" id="scar"><img src="images/shopCAR.png" alt="" style="width:30px">  购物车</li>
					<div class="shopCar" style="width:90%;height:80%;background:#fff;position:fixed;top:100px;left:5%;z-index:999;display:none;border:5px solid #FF8D1B;box-shadow:0 0 15px 5px #ccc; border-radius:8px;">
						<div style="height:6%;text-align:center;background:#FF8D1B;color:#fff;font-size:24px;line-height:30px">
							购物车
							<button type="button" class="close" id="close"><img src="./images/close.png" alt="" style="width:30px"></button>
						</div>
						<div class="" style="height:94%" >
							<iframe src="./shopping-cart.html" width="100%" height="100%" style="border:none">
							</iframe>
						</div>
					</div>
					<script type="text/javascript">
						$("#scar").click(function(){
							$(".shopCar").css({display:"block"})
						})
						$("#close").click(function(){
							$(".shopCar").css({display:"none"})
						})
					</script>
				</ul>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
	<div class="modal video-modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModal">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					登录 & 注册
					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
				</div>
				<section>
					<div class="modal-body">
						<div class="w3_login_module">
							<div class="module form-module">
							  <div class="toggle"><i class="fa fa-times fa-pencil"></i>
								<div class="tooltip">立即注册</div>
							  </div>
							  <div class="form">
								<h3>填写用户名和密码</h3>
								<form action="#" method="get">
								  <input type="text" name="Username" placeholder="用户名或手机号" required="" id="txtName">
								  <input type="password" name="Password" placeholder="密码" required="" id="passNum">
								</form>
									<button type="button" name="button" onclick="logi()">登录</button>
							  </div>
								<script type="text/javascript">
										var count = 0;
										function logi(){
											var txtName = document.getElementById("txtName").value;
											var passNum = document.getElementById("passNum").value;
											var data = JSON.parse(localStorage.getItem('logList'));
											data.shift();
											console.log(data);
											for(var i in data){
												if(data[i].name == txtName){
													if(data[i].password == passNum){
														alert("恭喜您登陆成功");
														window.location.href="index.html"
													}else{
														 count = count + 1;
														 console.log(count);
														 alert("对不起密码错误"+count+"次\n\n\n\n注意！！3次输入错误的密码将会永远的注销您的账户，您将需要重新注册或者申诉找回密码")
														 if(count == 3){
															 data.splice(i, 1);
															 data.unshift(null);
															 localStorage.setItem('logList',JSON.stringify(data));
															  alert("对不起,您永远的失去了我");
														 }
													}
												}
											}

										}
								</script>
							  <div class="form">
								<h3>注册相关信息</h3>
								<form method="get" >
								  <input type="text" name="Username" onfocus="onf1()" onblur="onb1()" id="yh" placeholder="用户名" required=""><span id="sp1"></span>
								  <input type="password" name="Password" onfocus="onf2()" onblur="onb2()" id="mm" placeholder="密码" required="">
									<span id="sp2"></span>
									<input type="password" name="Password" onfocus="onf3()" onblur="onb3()" id="mm1" placeholder="确认密码" required="">
									<span id="sp3"></span>
								  <input type="text" name="Email" onfocus="onf4()" onblur="onb4()" id="emil" placeholder="邮箱" required="">
									<span id="sp4"></span>
								  <input type="text" name="Phone" onfocus="onf5()" onblur="onb5()" id="tel" placeholder="电话号码" required="">
									<span id="sp5"></span>
								</form>
								<button onclick="onnb()">提交</button>
							  </div>
								<script type="text/javascript">
								$(".form span").css({
									fontSize:"11px",
									color:"blue"
								})
								function onf1(){
											document.getElementById('sp1').innerHTML = '用户名必须是4到10位的字母下划线数字，首字母不能是数字';
								}
								function onf2(){
											document.getElementById('sp2').innerHTML = '密码必须是6到15位的字母下划线数字';
								}
								function onf3(){
											document.getElementById('sp3').innerHTML = '要求和上面一样';
								}
								function onf4(){
											document.getElementById('sp4').innerHTML = '要求合法的emil地址';
								}
								function onf5(){
											document.getElementById('sp5').innerHTML = '填写11位的电话号码';
								}

								function onb1(){
									var yhm = /^[a-zA-Z_]\w{3,9}$/;
									var yh = document.getElementById('yh').value;
									var v = yhm.test(yh);
									var data = JSON.parse(localStorage.getItem('logList'));
									data.shift();
									var fleg = true;
									for(var i in data){
										if(data[i].name == yh){
											fleg = false
											console.log(fleg);
										}
									}
									if(v == true){
										if(fleg == true){
											document.getElementById('sp1').innerHTML = '★正确';
										}else {
											document.getElementById('sp1').innerHTML = '☆该用户已经被注册';
											return false;
										}
									}else{
										document.getElementById('sp1').innerHTML = '☆不符合要求';
										return false;
									}
								}
								function onb2(){
									var yhmm = /^\w{6,15}$/;
									var mm = document.getElementById('mm').value;
									var v = yhmm.test(mm);
									if(v == true){
										document.getElementById('sp2').innerHTML = '★正确';
									}else{
										document.getElementById('sp2').innerHTML = '☆不符合要求';
										return false;
									}
								}
								function onb3(){
									var mm = document.getElementById('mm').value;
									var mm1 = document.getElementById('mm1').value;

									if(mm == mm1){
										document.getElementById('sp3').innerHTML = '★正确';
									}else{
										document.getElementById('sp3').innerHTML = '☆不符合要求';
										return false;
									}
								}

								function onb4(){
									var dzyj = /^\w+@\w+\.(com|cn|net|com.cn|edu|gov)$/i;
									var emil = document.getElementById('emil').value;
									var v = dzyj.test(emil);
									if(v == true){
										document.getElementById('sp4').innerHTML = '★正确';
									}else{
										document.getElementById('sp4').innerHTML = '☆不符合要求';
										return false;
									}
								}

								function onb5(){
									var nlyz = /^13[0-9]{9}$/;
									var nl = document.getElementById('tel').value;
									var v = nlyz.test(nl);
									if(v == true){
										document.getElementById('sp5').innerHTML = '★正确';
									}else{
										document.getElementById('sp5').innerHTML = '☆不符合要求';
										return false;
									}
								}
								function onnb(){
									if(onb1() == false || onb2() == false || onb3() == false || onb4() == false || onb5() == false){
										alert("aaaaa")
										// localStorage.clear('logList');

									}else{
										var userName = document.getElementById("yh").value;
										var pwd = document.getElementById("mm").value;
										var pwd1 = document.getElementById("mm1").value;
										var email = document.getElementById('emil').value;
										var tel = document.getElementById('tel').value;
										var arr = [];
										arr = arr.concat(JSON.parse(localStorage.getItem('logList')))
										//alert(userName + "---"+pwd+ "---"+pwd1+ "---"+email+ "---"+tel)
										var obj = {
											name : userName,
											password : pwd,
											email : email,
											telNum : tel
										}
										arr.push(obj);
									  localStorage.setItem('logList',JSON.stringify(arr));
										console.log(JSON.parse(localStorage.getItem('logList')));
										alert("恭喜您成为天马茗茶的第"+(arr.length-1)+"个用户"+"\n"+"您的用户名是"+obj.name+"\n"+"您的密码是："+obj.password+"\n"+"请牢记您的密码，登录中超过3次输入不正确将会彻底注销您的用户"+"\n"+"\n"+"\n"+"\n"+"中北大学龚源CEO祝您生活愉快，阖家幸福")
									}
								}
								</script>
							  <div class="cta"><a href="#">忘记密码？</a></div>
							</div>
						</div>
					</div>
				</section>
			</div>
		</div>
	</div>
	<script>
		$('.toggle').click(function(){
		  $(this).children('i').toggleClass('fa-pencil');
		  $('.form').animate({
			height: "toggle",
			'padding-top': 'toggle',
			'padding-bottom': 'toggle',
			opacity: "toggle"
		  }, "slow");
		});
	</script>
	<div class="movies_nav">
		<div class="container">
			<nav class="navbar navbar-default">
				<div class="navbar-header navbar-left">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
						<span class="sr-only">点我</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
				</div>
				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">
					<nav>
						<ul class="nav navbar-nav">
							<li class="active"><a href="index.html">首页</a></li>
							<li class="dropdown">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown">品种<b class="caret"></b></a>
								<ul class="dropdown-menu multi-column columns-3">
									<li>
									<div class="col-sm-4">
										<ul class="multi-column-dropdown">
											<li><a href="genres.html">红茶</a></li>
											<li><a href="genres.html">绿茶</a></li>
											<li><a href="genres.html">茉莉花茶</a></li>
											<li><a href="genres.html">乌龙茶</a></li>
											<li><a href="horror.html">白茶</a></li>
											<li><a href="genres.html">黑茶</a></li>
											<li><a href="genres.html">黄茶</a></li>
											<li><a href="genres.html">花茶</a></li>
										</ul>
									</div>
									<div class="col-sm-4">
										<ul class="multi-column-dropdown">
											<li><a href="genres.html">铁观音</a></li>
											<li><a href="comedy.html">碧螺春</a></li>
											<li><a href="genres.html">大红袍</a></li>
											<li><a href="genres.html">金骏眉</a></li>
											<li><a href="genres.html">龙井</a></li>
										</ul>
									</div>
									<div class="col-sm-4">
										<ul class="multi-column-dropdown">
											<li><a href="genres.html">普洱茶</a></li>
											<li><a href="genres.html">蒙山黄芽</a></li>
											<li><a href="genres.html">白毫银针</a></li>
											<li><a href="genres.html">永春佛手</a></li>
											<li><a href="genres.html">贡眉</a></li>
											<li><a href="genres.html">茉莉花茶</a></li>
										</ul>
									</div>
									<div class="clearfix"></div>
									</li>
								</ul>
							</li>
							<li><a href="series.html">功夫茶</a></li>
							<li><a href="news.html">新闻</a></li>
							<li class="dropdown">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown">茶具<b class="caret"></b></a>
								<ul class="dropdown-menu multi-column columns-3">
									<li>
										<div class="col-sm-4">
											<ul class="multi-column-dropdown">
												<li><a href="genres.html">陶瓷</a></li>
												<li><a href="genres.html">紫砂</a></li>
												<li><a href="genres.html">玻璃</a></li>
												<li><a href="genres.html">金属</a></li>
											</ul>
										</div>
										<div class="col-sm-4">
											<ul class="multi-column-dropdown">
												<li><a href="genres.html">金灶</a></li>
												<li><a href="genres.html">甲馨</a></li>
												<li><a href="genres.html">束氏</a></li>
												<li><a href="genres.html">尚言坊</a></li>
											</ul>
										</div>
										<div class="col-sm-4">
											<ul class="multi-column-dropdown">
												<li><a href="genres.html">茶壶</a></li>
												<li><a href="genres.html">茶杯</a></li>
												<li><a href="genres.html">茶勺</a></li>
												<li><a href="genres.html">架子</a></li>
											</ul>
										</div>
										<div class="clearfix"></div>
									</li>
								</ul>
							</li>
							<li><a href="list.html">总列表</a></li>
						</ul>
					</nav>
				</div>
			</nav>
		</div>
	</div>
<!-- //nav -->
<div class="general_social_icons">
	<nav class="social">
		<ul>
			<li class="w3_twitter"><a href="#"><img src="./images/aa1.png" alt="" width="40px"></a></li>
			<li class="w3_facebook"><a href="#"><img src="./images/aa2.png" alt="" width="40px"></a></li>
			<li class="w3_dribbble"><a href="#"><img src="./images/aa3.png" alt="" width="40px"></a></li>
		</ul>
  </nav>
</div>
<!-- contact -->
	<div class="contact-agile">
		<div id="map"><iframe src="http://ditu.amap.com/search?query=%E4%B8%AD%E5%8C%97%E5%A4%A7%E5%AD%A6&city=140100&geoobj=112.452204%7C38.015697%7C112.46171%7C38.019772&zoom=17" width="100%" height="100%">
脚本之家使用了框架技术，但是您的浏览器不支持框架，请升级您的浏览器以便正常访问脚本之家。
</iframe> </div>
		<div class="faq">
			<h4 class="latest-text w3_latest_text">联系我们</h4>
			<div class="container">
				<div class="col-md-3 location-agileinfo">
					<div class="icon-w3">
						<span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span>
					</div>
					<h3>地址</h3>
					<h4>山西省，太原市，尖草坪</h4>
					<h4>中北大学</h4>
					<h4>文澜苑516宿舍</h4>
				</div>
				<div class="col-md-3 call-agileits">
					<div class="icon-w3">
						<span class="glyphicon glyphicon-earphone" aria-hidden="true"></span>
					</div>
					<h3>电话</h3>
					<h4>+18044126235</h4>
					<h4>+14056489808</h4>
					<h4>+16789339049</h4>
				</div>
				<div class="col-md-3 mail-wthree">
					<div class="icon-w3">
						<span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>
					</div>
					<h3>邮箱</h3>
					<h4><a href="mailto:info@example.com">example1@mail.com</a></h4>
					<h4><a href="mailto:info@example.com">example2@mail.com</a></h4>
					<h4><a href="mailto:info@example.com">example3@mail.com</a></h4>
				</div>
				<div class="col-md-3 social-w3l">
					<div class="icon-w3">
						<span class="glyphicon glyphicon-user" aria-hidden="true"></span>
					</div>
					<h3>社交工具</h3>
					<ul>
						<li><a href="#"><img src="images/aa2.png" alt="" style="width:20px;margin-left:10px"><span class="text">腾讯</span></a></li>
						<li class="twt"><a href="#"><img src="images/aa3.png" alt="" style="width:20px;margin-left:10px"><span class="text">微信</span></a></li>
						<li class="ggp"><a href="#"><img src="images/aa1.png" alt="" style="width:20px;margin-left:10px"><span class="text">微博</span></a></li>
					</ul>
				</div>
				<div class="clearfix"></div>
				<form action="#" method="post">
					<input type="text" name="your name" placeholder="名字" required="">
					<input type="text" name="your name" placeholder="昵称" required="">
					<input type="text" name="your email" placeholder="电子邮箱" required="">
					<input type="text" name="subject" placeholder="电话号码" required="">
					<textarea  name="your message" placeholder="您的建议" required=""></textarea>
					<input type="submit" value="提交">
				</form>
			</div>
		</div>
	</div>
	<div class="footer">
		<div class="container">
			<div class="w3ls_footer_grid">
				<div class="col-md-6 w3ls_footer_grid_left">
					<div class="w3ls_footer_grid_left1">
						<h2>订阅</h2>
						<div class="w3ls_footer_grid_left1_pos">
							<form action="#" method="post">
								<input type="email" name="email" placeholder="电子邮箱" required="">
								<input type="submit" value="发送">
							</form>
						</div>
					</div>
				</div>
				<div class="col-md-6 w3ls_footer_grid_right">
					<a href="index.html"><h2>Tea<span>天马茗茶</span></h2></a>
				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="col-md-5 w3ls_footer_grid1_left">
				<p>1314011225   13190b08  中北大学毕业设计</p>
			</div>
			<div class="col-md-7 w3ls_footer_grid1_right">
				<ul>
					<li>
						<a href="genres.html">茶叶</a>
					</li>
					<li>
						<a href="faq.html">帮助</a>
					</li>
					<li>
						<a href="horror.html">关于我们</a>
					</li>
					<li>
						<a href="contact.html">联系我们</a>
					</li>
				</ul>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
<script src="js/bootstrap.min.js"></script>
<script>
$(document).ready(function(){
    $(".dropdown").hover(
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideDown("fast");
            $(this).toggleClass('open');
        },
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideUp("fast");
            $(this).toggleClass('open');
        }
    );
});
</script>
	<script type="text/javascript">
		$(document).ready(function() {
			$().UItoTop({ easingType: 'easeOutQuart' });

			});
	</script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
